<template lang="html">
  <div class="sell-well" v-if="list">
    <div class="sell-left" @click="goGoodsDetail(list[0])">
      <img class="max" :src="list[0].photo">
    </div>
    <div class="sell-right" @click="goGoodsDetail(list[1])">
      <img class="max" :src="list[1].photo">
    </div>
  </div>
</template>

<script>
import { getHotSale } from '@/api/sellwell'
export default {
  data() {
    return {
      list: null,
    }
  },
  created() {
    this.getHotSale();
  },
  methods: {
    getHotSale() {
      getHotSale().then(res=>{
        console.log(res.data)
        this.list = res.data;
      })
    },
    goGoodsDetail(item) {
      if(item.url && item.url != '#'){
        this.$router.push('goodslist_detail?id='+item.url)
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.sell-well{
  background: url('/static/new/ymx/home_hot_bg@2x.png') center center no-repeat;
  background-size: 100% 100%;
  width: 94%;
  margin: 0 auto;
  height: 6.8rem;
  margin-bottom: .4rem;
  overflow: hidden;
  padding-top: 1.8rem;
  padding-left: .3rem;
  padding-right: .3rem;
  .sell-left{
    width: 36%;
    float: left;
    height: 4.5rem;
  }
  .sell-right{
    width: 61%;
    float: left;
    margin-left: 3%;
    height: 4.5rem;
  }
  .sell-left,.sell-right{
    img{
      width: 100%;
      height: 100%;
    }
  }
}
</style>
